package ui.home.column2.channel_mapping.group

import androidx.compose.foundation.*
import androidx.compose.foundation.layout.*
import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.foundation.lazy.items
import androidx.compose.foundation.lazy.rememberLazyListState
import androidx.compose.foundation.shape.CircleShape
import androidx.compose.material.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.MutableState
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.ui.Alignment
import androidx.compose.ui.ExperimentalComposeUiApi
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.clip
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.graphics.painter.BitmapPainter
import androidx.compose.ui.input.pointer.PointerEventType
import androidx.compose.ui.input.pointer.onPointerEvent
import androidx.compose.ui.layout.ContentScale
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.text.TextStyle
import androidx.compose.ui.text.style.TextOverflow
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import model.vo.FriendsMappingItem
import model.vo.GroupMappingItem
import theme.EasyChatTheme
import ui.compose.NetworkImage
import ui.home.HomeViewModel
import ui.home.column2.channel_mapping.friends.FriendsMappingRow


/**
 * @author wei kunJie
 * @date 2024/3/25 14:48:37
 */
@OptIn(ExperimentalComposeUiApi::class)
@Composable
fun GroupMappingList(easyChatTheme: MutableState<EasyChatTheme>,modifier: Modifier,groupMappingItems: MutableList<GroupMappingItem>,homeViewModel: HomeViewModel) {
    val selectAccount = remember { mutableStateOf("") }
    val isActivityVerticalScrollbar = remember { mutableStateOf(false) }
    Box(modifier = modifier
        .onPointerEvent(PointerEventType.Enter) { isActivityVerticalScrollbar.value = true }
        .onPointerEvent(PointerEventType.Exit) { isActivityVerticalScrollbar.value = false }) {
        val state = rememberLazyListState()
        //渲染列表
        LazyColumn(modifier = Modifier.fillMaxSize(), state = state) {
            items(groupMappingItems) { item ->
                if (homeViewModel.searchText.value == "") {
                    GroupMappingRow(item = item, selectAccount = selectAccount, easyChatTheme = easyChatTheme)
                } else if (
                    item.groupAccount.contains(homeViewModel.searchText.value) ||
                    item.groupName.contains(homeViewModel.searchText.value)
                ) {
                    GroupMappingRow(item = item, selectAccount = selectAccount, easyChatTheme = easyChatTheme)
                }

            }
        }
        //只有当鼠标进入时才出现滚动条
        if (isActivityVerticalScrollbar.value) {
            VerticalScrollbar(
                modifier = Modifier.align(Alignment.CenterEnd).fillMaxHeight(),
                adapter = rememberScrollbarAdapter(
                    scrollState = state
                )
            )
        }
    }
}

@OptIn(ExperimentalFoundationApi::class)
@Composable
fun GroupMappingRow(easyChatTheme: MutableState<EasyChatTheme>,item:GroupMappingItem,selectAccount: MutableState<String>){
    Box(
        modifier = Modifier.background(
            color = if (selectAccount.value == item.groupAccount) easyChatTheme.value.mainColor
            else Color.Transparent
        )
            .fillMaxWidth()
            .height(81.dp)
            .combinedClickable(onClick = {
                selectAccount.value = item.groupAccount
            }
            ),
    ) {
        Row(
            modifier = Modifier.padding(start = 15.dp, top = 15.dp, bottom = 15.dp, end = 10.dp)
        ) {
            //头像
            NetworkImage(
                url = item.groupHeadUrl,
                painterFor = { remember { BitmapPainter(it) } },
                contentDescription = "头像",
                modifier = Modifier.size(51.dp).clip(CircleShape),
                contentScale = ContentScale.Crop,
                defaultPainterFor = painterResource("image/default_head.png")
            )
            Spacer(modifier = Modifier.width(10.dp))
            //群名称
            Row(modifier = Modifier.weight(1f).fillMaxHeight(), verticalAlignment = Alignment.CenterVertically) {
                //群名称
                Text(
                    text = item.groupName,
                    maxLines = 1,
                    overflow = TextOverflow.Ellipsis,
                    style = TextStyle(
                        color = Color.Black,
                        fontSize = 17.sp
                    )
                )
            }
        }
    }
}